<template>
  <div id="changedialog">
    <commonformdialog
      :isshowDialogs="isshowDialog"
      :dialogTitle="dialogTitle"
      @closetextDialog="closetextDialog"
      @confirmbtn="confirmbtn"
      @rejected="rejected"
      :isshowFooter="false"
      :isshowFooterBh="isshowFooterBh"
    >
      <div class="innerLoding">
        <el-row>
          <el-form
            :model="formData"
            ref="ruleForm"
            label-width="120px"
            size="small"
          >
            <el-col :span="24">
              <h3 class="titleTips">
                审核信息：<span class="look">{{ formData.statusText }}</span>
              </h3>
            </el-col>
            <el-col :span="24">
              <el-form-item label="活动图片:" prop="activityHeadImg">
                <el-image
                  style="width: 100px; height: 100px"
                  :src="formData.activityHeadImg"
                  :preview-src-list="[formData.activityHeadImg]"
                   :zIndex='9999'
                >
                </el-image>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="活动名称:" prop="activityTitle">
                <span>{{ formData.activityTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="申请平台:" prop="platformTitle">
                <span>{{ formData.platformTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="平台电话:" prop="platformTel">
                <span>{{ formData.platformTel }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="平台微信:" prop="platformWeChat">
                <span>{{ formData.platformWeChat }}</span>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="平台内容:">
                <div
                  class="textItem"
                  v-for="(i, index) in formData.content"
                  :key="index"
                >
                  <p>
                    <span :class="i.title == 1 ? 'borderTitle' : ''">{{
                      i.text
                    }}</span>
                  </p>
                </div>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </div>
      <toExamine
        :isshowDialogE="isshowDialogE"
        :status="status"
        :id="id"
        @closedialogE="closeDialogE"
        @confirmbtnE="confirmbtnE"
      ></toExamine>
    </commonformdialog>
  </div>
</template>

<script type="text/javascript">
//引入弹窗
import commonformdialog from "@/components/commondialog/commondialog";

import toExamine from "./toExamine";

export default {
  data() {
    return {
      formData: {},
      isshowFooterBh: false,
      isshowDialogE: false,
      isdisable: true,
      status: null,
      id: null,
      mapData: {},
    };
  },
  props: {
    //是否显示弹窗
    isshowDialog: {
      type: Boolean,
      default: false,
      required: true,
    },
    //表单的名字
    dialogTitle: {
      type: String,
      default: "",
      required: true,
    },
    //是编辑还是新增
    formType: {
      type: Number,
      default: 0,
    },
    dialogdata: {
      type: Object,
    },
  },
  components: {
    commonformdialog,
    toExamine,
  },
  methods: {
    closetextDialog() {
      this.$emit("closedialog");
    },
    //关闭审核弹框
    closeDialogE() {
      this.isshowDialogE = false;
    },
    //提交审核
    confirmbtnE() {
      this.isshowDialogE = false;
      //通知父级关闭弹框
      console.log("审核提交");
      this.$emit("confirm");
    },
    //驳回
    rejected() {
      this.status = 2;
      this.id = this.formData.id;
      this.isshowDialogE = true;
    },
    //通过
    confirmbtn() {
      this.status = 1;
      this.id = this.formData.id;
      this.isshowDialogE = true;
    },
  },
  watch: {
    isshowDialog: function (val) {
      if (!val) {
        this.$refs["ruleForm"].resetFields();
      }
    },
    dialogdata: function (val) {
      if (val) {
        this.$nextTick(() => {
          this.formData = val;
          if(this.formData.content){
             this.formData.content = JSON.parse(this.formData.content);
          }
          console.log(this.formData.details);
        });
      }
    },
    formType: function (val) {
      if (val === 0) {
        this.isshowFooterBh = false;
      } else {
        this.isshowFooterBh = true;
      }
    },
  },
  created() {},
};
</script>

<style lang="scss" scoped>

.mapBox {
  position: relative;
  height: 500px;
}
.textItem {
  h3 {
    color: red;
    margin-bottom: 10px;
  }
  .borderTitle {
    font-weight: bold;
    font-size: 15px;
  }
}
</style>
